<template>
  <div>
    <el-row v-loading="loading">
      <el-col :offset="2" :span="20">
        <el-steps :active="step" finish-status="success">
          <el-step title="基本信息"></el-step>
          <el-step title="身份认证"></el-step>
          <el-step title="发放设备"></el-step>
        </el-steps>
        <br /><br /><br />
      </el-col>

      <el-col :offset="6" :span="12" v-show="step == 0">
        <consumer-add-or-update
          :dataForm="consumerInfo"
          v-if="consumerAddOrUpdateVisible"
          ref="ConsumerAddOrUpdate"
          @changeStep="changeStep"
        >
        </consumer-add-or-update>
      </el-col>
      <el-col :offset="6" :span="12" v-show="step == 1">
        <consumer-check
          :dataForm="consumerInfo"
          v-if="consumerCheckVisible"
          ref="ConsumerCheck"
          @changeStep="changeStep"
        >
        </consumer-check>
      </el-col>
      <el-col :offset="6" :span="12" v-show="step == 2">
        <consumer-success
          :dataForm="consumerInfo"
          v-if="consumerSuccessVisible"
          ref="ConsumerSuccess"
          @changeStep="changeStep"
        >
        </consumer-success>



      </el-col>
      <el-col :offset="2" :span="20"  v-show="step == 3">
        <consumer-end
          :dataForm="consumerInfo"
          v-if="consumerEndVisible"
          ref="ConsumerEnd"
          @changeStep="changeStep"
        >
        </consumer-end>

      </el-col>
    </el-row>
  </div>
</template>



<script>
import ConsumerAddOrUpdate from "./gen/consumer-add-or-update";
import ConsumerCheck from "./gen/consumer-check";
import ConsumerSuccess from "./gen/consumer-success";
import ConsumerEnd from "./gen/consumer-end";
export default {
  components: {ConsumerEnd, ConsumerAddOrUpdate ,ConsumerCheck,ConsumerSuccess},
  data() {
    return {
      loading:true,
      cuserid: this.$cookie.get("userid"),
      stepStatus: 0, //检测账户是否已经开启注册
      step: 0,
      //子组件的可视化
      consumerAddOrUpdateVisible: true,
      consumerCheckVisible: true,
      consumerSuccessVisible: true,
      consumerEndVisible:true,
      //用户状态
      consumerInfo:{
          consumerId: this.$cookie.get("userid"),
          username: '',
          level: '',
          count: '',
          status: "danger",
          email: '',
          phone: '',
          ckey: '123456'
        },
    };
  },

  methods: {
    changeStep(s) {
      this.step = s;
    },
    //检查用户注册的状态
    getRegStatus(uid){
      this.$http({
        url: this.$http.adornUrl(`/product/consumer/reg/check/${uid}`),
        method: 'get',
      }).then(({data}) => {
        if (data && data.code === 0) {

          //子组件数据同步
          
          this.consumerInfo = data.data;
          if(this.consumerInfo.status == 0){
            this.step = 1;
          }else if(this.consumerInfo.status == 1){
            this.step = 3;
          }else if(this.consumerInfo.status == 2){
            //有验证码了
            this.step = 2;
          }
        }else{
          //没这个id
          this.step = 0;
          //填入预置的数据
          // console.log(this.consumerInfo)
          this.$http({
            url: this.$http.adornUrl(`/yisoo/info/${uid}`),
            method: 'get',
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.consumerInfo.username = data.data.username
              // this.dataForm.status = data.data.status === 1 ? "success" :"danger"
              this.consumerInfo.email = data.data.email
              this.consumerInfo.phone = data.data.mobile
            }
          })
        }
      })
        setTimeout(() => {
          this.loading = false;
        }, 400);
    }
  },
  created() {
    this.getRegStatus(this.$cookie.get("userid"));
  },
};
</script>
